<template>
  <div>
    <el-dialog
      v-model="dialogVisible"
      width="80%"
      align-center
      :show-close="false"
      destroy-on-close
      draggable
    >
      <template #header="{ close }">
        <div class="dialog-header flex justify-between items-center">
          <div>项目变更</div>
          <el-icon class="el-icon--left cursor-pointer" @click="close"
            ><CircleCloseFilled color="#fff"
          /></el-icon>
        </div>
      </template>
      <ChangeInfo :operateId="operateId" showCheckText v-if="projectClass != 'yfContract'" />
      <YfChangeInfo :operateId="operateId" showCheckText v-else />
      <template #footer>
        <div class="dialog-footer">
          <div class="operate-btns">
            <el-button type="primary" @click="dialogVisible = false">关闭</el-button>
          </div>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script setup>
import ChangeInfo from "./ChangeInfo.vue"; //校级和纵向
import YfChangeInfo from "@/views/project/yf/jzhtbg/components/ChangeInfo.vue"; //横向
const dialogVisible = ref(false);
const operateId = ref(null);
const projectClass = ref("");
//查看
const view = (id, proClass) => {
  dialogVisible.value = true;
  operateId.value = id;
  projectClass.value = proClass;
};
defineExpose({ view });
</script>

<style scoped lang="scss">
@import url("@/views/project/index.scss");
:deep(.el-dialog__body) {
  padding-bottom: 55px !important;
}
</style>
